<template>
	<div class="toolset">
		<el-button text :icon="searchVisible ? 'ZoomOut' : 'ZoomIn'" circle v-ripple :disabled="loading" v-if="hasSearch"
			@click="onChangeSearchVisible" title="搜索"></el-button>
		<el-button text icon="Download" circle v-ripple :disabled="loading" v-if="hasExport" @click="toExport"
			title="导出"></el-button>
		<v-column v-if="hasColumn" :table-options="tableOptions"></v-column>
	</div>
</template>

<script setup>
import VColumn from "./column/index.vue"

const props = defineProps({
	hasSearch: {
		type: Boolean,
		defautl: true,
	},
	hasExport: {
		type: Boolean,
		defautl: true,
	},
	hasColumn: {
		type: Boolean,
		defautl: true,
	},
	loading: {
		type: Boolean,
		defautl: false,
	},
	tableOptions: {
		type: Array,
		defautl: () => [],
	},
	searchVisible: {
		type: Boolean,
	},
})
const emits = defineEmits(["update:searchVisible", "on-export"])

function onChangeSearchVisible() {
	emits("update:searchVisible", !props.searchVisible)
}
function toExport() {
	emits("on-export", props.tableOptions)
}
</script>

<style lang="scss" scoped>
.toolset {
	:deep() {
		.el-button {
			min-height: 0;
		}
	}
}
</style>
